Interactive Map
An interactive map can be used for data that variable across time and space as filters allows for multidimentional analysis
Set Up
[13]:
from observable_jupyter import embed
import pandas as pd
import json
Load and Format Data
[14]:
Manatee_df = pd.read_csv("Demo_Data/Manatee_Carcass_Recovery_Locations_in_Florida.csv", index_col = None)
[15]:
Manatee_df.head()
[15]:
| X | Y | OBJECTID | FIELDID | REPDATE | REPYEAR | REPMONTH | REPDAY | SEX | TLENGTH | STATE | COUNTY | LAT | LONG_ | DCODE | MORTALITY | created_user | created_date | last_edited_user | last_edited_date | |
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 0 | -80.117610 | 26.100406 | 149433 | M7401 | 1974/04/03 00:00:00+00 | 1974 | 4 | 3 | F | 260.0 | FL | Broward | 26.100401 | -80.117607 | 9 | Undetermined: Other | FWC | 2021/10/15 11:30:55+00 | FWC | 2021/10/15 11:30:55+00 |
| 1 | -80.166435 | 25.833716 | 149434 | M7402 | 1974/06/27 00:00:00+00 | 1974 | 6 | 27 | M | 290.0 | FL | Miami-Dade | 25.833711 | -80.166433 | 1 | Human Related: Watercraft Collision | FWC | 2021/10/15 11:30:55+00 | FWC | 2021/10/15 11:30:55+00 |
| 2 | -80.149398 | 25.931415 | 149435 | M7403 | 1974/08/20 00:00:00+00 | 1974 | 8 | 20 | M | 305.0 | FL | Miami-Dade | 25.931411 | -80.149396 | 1 | Human Related: Watercraft Collision | FWC | 2021/10/15 11:30:55+00 | FWC | 2021/10/15 11:30:55+00 |
| 3 | -80.830999 | 28.860008 | 149436 | M001 | 1974/10/23 00:00:00+00 | 1974 | 10 | 23 | F | 345.4 | FL | Volusia | 28.860002 | -80.830996 | 3 | Human Related: Other | FWC | 2021/10/15 11:30:55+00 | FWC | 2021/10/15 11:30:55+00 |
| 4 | -80.738514 | 28.400178 | 149437 | M7404 | 1974/11/11 00:00:00+00 | 1974 | 11 | 11 | F | 290.0 | FL | Brevard | 28.400173 | -80.738511 | 3 | Human Related: Other | FWC | 2021/10/15 11:30:55+00 | FWC | 2021/10/15 11:30:55+00 |
The following block of structures the data into a format accepted by Observable.
[16]:
result = Manatee_df.to_json(orient="records")
parsed = json.loads(result)
data = json.dumps(parsed, indent=4)
Formated_Data = json.loads(data)
Embed your data into the visualization
The Barchart Race visualization consists of two cells:
chart : Depicts the map and the associated data
viewof CountyFilter : Depicts the checklist filter tool
viewof dateLimits : Depicts the date filter
To make your visualization work you will need to access the input variables:
contour : should be set to a geojson file containing the data needed to draw your desired map. The easiest way to do this is to find a git hub repo that contains the data and set contour equal to the raw content of the github repo.
data : Should be set equal to your structured data.
longitude_var : Should be set to the name of the column containing the longitude variable in your data.
latitude_var : Should be set to the name of the column containing the latitude_var variable in your data.
[17]:
embed("@rstorni/voronoi-map-observable-jupyter-with-filters", cells = ["chart", "draw", "viewof CountyFilter", "viewof dateLimits"],
inputs = {
'contour' : "https://raw.githubusercontent.com/danielcs88/fl_geo_json/master/geojson-fl-counties-fips.json",
'data' : Formated_Data,
'longitude_var' : 'LONG_',
'latitude_var' : 'LAT',
}
)
